<html>
<head>
<script type="text/javascript" src="<?php echo base_url('public/js/jquery-2.0.3.js')?>"></script>
</head>
<body>
<script type="text/javascript">
		$(document).ready(function(){
			getData(0);
			});
		function getData(abc){
		$.ajax({
				type : 'GET',
				url  : 'paging' ,
				data : "page="+abc,
				success : function(msg){
						var pagination = "";
						var table = "";
						var getData = $.parseJSON(msg);
						var recordNums = getData.record_num;
						var pageNums = getData.page_num;
						var startLoop = getData.start_loop;
						var endLoop = getData.end_loop;
						var data = getData.database;

						$(data).each(function(index, value){
								table += "<table border='1'>";
								table += "<tr><td>ID</td><td>Name</td><td>Age</td></tr>";
								table += "<tr><td>"+value.id+"</td><td>"+value.name+"</td><td>"+value.age+"</td></tr>";
								table += "</table>";
								table += "<br />";
							});
						
						pagination += "<input type='button' value ='Đầu' onclick='getData(0);'>";
						for(var i=startLoop; i<=endLoop;i++){
								pagination += "<input type='button' value ='"+i+"' onclick='getData(this.value);'>";
							}
						pagination += "<input type='button' value ='Cuối' onclick='getData("+pageNums+");'>";
						$('#container').html(table);
						$('#pagination').html(pagination);
					}
			});
		}
</script>
<div id="container"></div>
<div id="pagination"></div>
</body>

</html>